<template>
	<view class="listclass">
		<swiper :indicator-dots="true" indicator-active-color="#fff" :autoplay="true" :interval="3000" :duration="1000">
			<block v-for="(item,index) in banner" :key="index">
				<swiper-item>
					<view class="swiper-item">
						<image :src="item.image" mode="widthFix"></image>
					</view>
				</swiper-item>
			</block>
		</swiper>
		
		<divider></divider>
		
		<card :headTitle="name">
			<view class="row j-sb">
				<block v-for="(item,index) in Allclass" :key="index">
					<common-list :item="item"></common-list>
				</block>
			</view>
		</card>
	</view>
</template>

<script>
	import {mapState} from 'vuex';
	import card from "@/components/common/card.vue";
	import commonList from "@/components/common/common-list.vue"
	export default {
		data() {
			return {
				Allclass:[],
				id:'',
				name:''
			}
		},
		components:{
			card,
			commonList
		},
		onLoad(option){
			this.id = option.id
			this.getclass()
		},
		computed:{
			...mapState({
				banner:state=>state.login.banner
			}),
		},
		methods: {
			getclass(){
				this.$H.post('/category/categoryAll',{
					categoryAllID:this.id
				}).then(res=>{
					this.Allclass = res.msg[0].goods;
					this.name= res.msg[0].MALL_CATEGORY_NAME
				})
			}
		}
	}
</script>

<style>

</style>
